/**
 * Created by GYL on 2018/7/25
 */
/* eslint-disable */
import React, { Component } from 'react';
import MyModal from '../../../../components/common/MyModal';
import { Form, Row, Col, Select, Input, message, Button, Upload, Icon, DatePicker } from 'antd';
import Util from '../../../../utils/Util';
import MyIcon from '../../../../components/common/MyIcon';
import config from '../../../../config';
import style from "./AddModal.less";
import moment from 'moment';
import myModalStyles from '../../../../components/common/Mymodal.less';
import request from '../../../../utils/request';
// import styles from './sub.less';
import MyTable from "../../../../components/common/MyTable";
import Echarts_baojing from '../../echarts/Echarts_baojing';
const { TextArea } = Input;
const FormItem = Form.Item;

class AddModal extends Component {
  state = {
    solidType: '1',
    tableData: [],
    upDis: true,
    flag: false
  };
  componentDidMount() {

  };
  // modal保存
  onModalSave = () => {
    this.props.form.validateFieldsAndScroll((err, val) => {
      if (!err) {
        this.props.onModalSave(val, this.props.type)
      }
    });
  };
  // 筛选条件组件change事件
  getChangeValue(value, e) {

    let t = this;
    let params = {};
    params[value] = e.target.value;
    t.setState({ params });
  }
  onCheckbox(value, e) {
    let t = this;
    let params = {};
    params[value] = e.target.value;
    t.setState({ params });
  }

  selectedChange(fun, nextParams, paramName, value) {
    console.log(fun, nextParams, paramName, value)



    let t = this;
    let params = {};
    params[paramName] = value;
    if (paramName) {
      t.setState({ params }, () => {
      });
    }
    if (typeof fun === "function") {
      fun(value);
      if (nextParams)
        t.props.form.setFieldsValue({
          [nextParams]: ''
        })
    }
  }


  render() {
    let t = this;
    let { tableData, upDis } = t.state;

    let { getFieldDecorator } = t.props.form;

    let titleText = this.props.titleText
    let arr1 = this.props.moddleArr;
    const formItemLayout = {
      labelCol: { span: 8 },
      wrapperCol: { span: 16 },
    }
    return (
      <div >
        <MyModal
          {...t.props}
          // className={myModalStyles.jlModal}
          width={this.props.width}
          onModalSave={t.onModalSave}>
          <Form layout={'inline'}>
            <Row gutter={48} className={style.AddModal}>

              {
                arr1.map((item, index) => {
                  if (item.type === 'input') {
                    return (

                      <Col span={item.span}>

                        <FormItem label={item.label} key={index} className={item.className}  {...formItemLayout}>
                          {
                            getFieldDecorator(item.paramName, {
                              initialValue: item.initialValue ? item.initialValue : '',
                              rules: item.rules || null
                            })(
                              <TextArea rows={item.rows || 1} onChange={t.getChangeValue.bind(t, item.paramName)} size={config.size} style={item.style}
                                placeholder={item.placeholder} disabled={item.disabled} id={[item.paramName]} />
                            )
                          }
                        </FormItem>
                      </Col>

                    )
                  } else if (item.type === 'datePicker') {
                    // let disabled = item.disabledDate ? disabledDate : null;
                    return (
                      <Col span={item.span}>

                        <FormItem label={item.label} key={index} className={item.className}  {...formItemLayout}>

                          {
                            getFieldDecorator(item.paramName, {
                              initialValue: item.initialValue ? item.initialValue : null,
                              rules: item.rules || null
                            })(
                              <DatePicker size={config.size} disabledDate={item.disabled} disabled={item.disabled} style={item.style} format={"YYYY-MM-DD HH:mm:ss"} showTime={true}
                              />
                            )
                          }
                        </FormItem>
                      </Col>
                    )
                  } else if (item.type === 'select') {
                    return (
                      <Col span={item.span}>
                        <FormItem label={item.label} key={index} className={item.className}  {...formItemLayout}>
                          {
                            getFieldDecorator(item.paramName, {
                              initialValue: item.initialValue ? item.initialValue : (item.options[0] ? item.options[0].value : item.options[0]),
                              rules: item.rules || null
                            })(
                              <Select
                                size={config.size}

                                showSearch
                                mode={item.mode}
                                style={{ width: item.width || 150 }}
                                optionFilterProp="children"
                                dropdownMatchSelectWidth={t.props.dropdownMatchSelectWidth}
                                onChange={t.selectedChange.bind(t, item.selectChange, item.nextParamName || false, item.paramName)}
                                onSelect={item.onSelect}
                                disabled={item.disabled}
                              >
                                {
                                  item.options.map(option => {
                                    return (
                                      <Select.Option key={option.value}
                                        value={option.value}
                                      >
                                        {option.text}
                                      </Select.Option>

                                    )
                                  })
                                }
                              </Select>
                            )
                          }
                        </FormItem>
                      </Col>
                    )
                  }
                })
              }

            </Row>

          </Form>
            <Echarts_baojing dataList={this.props.dataList} timeList={this.props.timeList}/>
        </MyModal>
      </div>
    )
  }
}
export default Form.create()(AddModal);
